Profiler API可以提供各種組件在執行的時候所花費的時間詳細訊息，這樣可以讓使用者知道那些組件所花費的時間太多，並且需要進一步改進它的，但是Profiler API並不測量網絡延遲。Profiler API是一個調試工具，為搜索執行增加了大量開銷，因此它在生產構建中被禁用。

使用方法
就像上面說的，我們可以藉由Profiler API測量React 應用程序渲染的頻率以及渲染的成本是多少，具體的用法就是把Profile添加到樹的任何一個位置，來衡量成本，要完成這件事就需要兩個props，一個id和一個onRender。

render(
  <App>
    <Profiler id="Navigation" onRender={callback}>
      <Navigation {...props} />
    </Profiler>
    <Main {...props} />
  </App>
);

注意:使用Profiler會給內存以及cpu增加一定的開銷，雖然是輕量級組件，但還是要注意在必要時在使用。

使用onrender callback
每當分析樹中的組件“提交”更新時，React 都會調用此函數。它可以提供各種組件在渲染時所花費的時間訊息。

這是onrender callback的各種道具:

id: string- 這可用於識別樹的哪個部分已提交。
phase: "mount" | "update"- 識別樹是始不是已經安裝，或是否已經重新更新過了。
actualDuration: number- 呈現提交的更新所花費的時間
baseDuration: number-在沒有記憶的情況下估計渲染整個子樹的時間。
startTime: number- React 開始渲染當前更新的時間。
commitTime: number- React 提交當前更新的時間。這項功能可以在分析器間共享
interactions: Set-在計劃更新時正在跟踪的一組“交互” 。(有點看不懂這個...)可以在https://gist.github.com/bvaughn/8de925562903afd2e7a12554adcdda16 了解更多有關交互的知識

參考文獻:
https://reactjs.org/docs/profiler.html
https://blog.csdn.net/limboys/article/details/98960179